<template> 
    <div class="alert_container"> 
        <section class="tip_text_container"> 
            <div class="tip_icon"> 
                <span></span> 
                <span></span> 
            </div> 
            <p class="tip_text">{{alertText}}</p> 
            <div class="confrim" @click="closeTip">确认</div> 
        </section> 
    </div> 
</template>
<script> 
export default { 
    props: { alertText: String },
    methods: { 
        closeTip() { 
            this.$emit('closeTip') 
        } 
    } 
} 
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>        
    @import "../assets/stylus/mixin.styl" 
    @keyframes tipMove 
        0%  
            transform: scale(1) 
        35%
            transform: scale(.6)
        70%
            transform: scale(1.1)
        100%
            transform: scale(1)
    .alert_container 
        position fixed 
        top 0 
        left 0 
        right 0 
        bottom 0 
        z-index 200 
        background rgba(0, 0, 0, .5) 
        .tip_text_container 
            position absolute 
            top 50% 
            left 50% 
            margin-top -4.8rem 
            margin-left -5.8rem
            width 60% 
            animation tipMove .4s
            background-color rgba(255, 255, 255, 1) 
            padding-top 1.2rem 
            display flex 
            justify-content center 
            align-items center
            flex-direction column 
            border-radius 5px
            .tip_icon 
                width 4rem 
                height 4rem 
                border 0.1rem solid #f5A100
                border-radius 50% 
                font-size 1.2rem 
                display flex 
                justify-content center 
                align-items center 
                flex-direction column 
                span:nth-of-type(1) 
                    width 0.1rem 
                    height 1.6rem 
                    background-color #f5A100  
                span:nth-of-type(2) 
                    width  0.2rem 
                    height  0.2rem 
                    border-radius 50% 
                    margin-top  0.2rem 
                    background-color #f5A100 
            .tip_text 
                font-size 14px 
                color #333 
                line-height 20px 
                text-align center 
                margin-top 10px 
                padding 0 5px    
            .confrim 
                font-size 18px 
                font-weight bold 
                margin-top 10px
                color #fff
                background-color #41B883 
                width 100% 
                text-align center 
                line-height 2rem 
                border 1px color #fff 
                border-bottom-left-radius 5px 
                border-bottom-right-radius 5px         
</style>